{% extends 'base.html' %}

{% block title %}为您推荐 - 电影推荐系统{% endblock %}

{% block content %}
<div class="container py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1>为您推荐的电影</h1>
        <div class="dropdown">
            <button class="btn btn-outline-secondary dropdown-toggle" type="button" id="recommendTypeDropdown" data-bs-toggle="dropdown" aria-expanded="false">
                {{ recommendation_type_display }}
            </button>
            <ul class="dropdown-menu" aria-labelledby="recommendTypeDropdown">
                <li><a class="dropdown-item" href="?type=similar">基于您喜欢的电影</a></li>
                <li><a class="dropdown-item" href="?type=genre">基于您喜欢的类型</a></li>
                <li><a class="dropdown-item" href="?type=popular">热门电影</a></li>
            </ul>
        </div>
    </div>
    
    {% if not has_ratings and recommendation_type != 'popular' %}
    <div class="alert alert-info">
        <p><strong>您还没有评分记录!</strong> 为了给您提供个性化推荐，请先评价一些电影。</p>
        <p>目前我们为您显示的是热门电影。</p>
        <a href="{% url 'movie_list' %}" class="btn btn-primary">浏览电影</a>
    </div>
    {% endif %}
    
    <div class="row">
        {% for movie in recommended_movies %}
        <div class="col-md-3 mb-4">
            <div class="card h-100">
                <img src="{{ movie.poster_url|default:'https://via.placeholder.com/300x450?text=暂无海报' }}" 
                     class="card-img-top" alt="{{ movie.title }}" 
                     onerror="this.src='https://via.placeholder.com/300x450?text=暂无海报'">
                <div class="card-body">
                    <h5 class="card-title">{{ movie.title }} ({{ movie.year }})</h5>
                    
                    <div class="d-flex justify-content-between align-items-center my-2">
                        <div class="badge bg-info">
                            评分: {{ movie.average_rating|floatformat:1 }}/5
                        </div>
                        <div>
                            {% for genre in movie.genres.all|slice:":2" %}
                            <span class="badge bg-secondary">{{ genre.name }}</span>
                            {% endfor %}
                        </div>
                    </div>
                    
                    <p class="card-text text-truncate">{{ movie.description }}</p>
                    
                    {% if movie.recommendation_reason %}
                    <div class="alert alert-light p-2 small mb-3">
                        <i class="fas fa-info-circle me-1"></i> {{ movie.recommendation_reason }}
                    </div>
                    {% endif %}
                    
                    <a href="{% url 'movie_detail' movie.id %}" class="btn btn-outline-primary w-100">查看详情</a>
                </div>
            </div>
        </div>
        {% empty %}
        <div class="col-12">
            <div class="alert alert-warning">
                目前没有适合您的推荐。请尝试评价更多电影或选择其他推荐方式。
            </div>
        </div>
        {% endfor %}
    </div>
</div>
{% endblock %} 